<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Aea</title>
  <base href="/">

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
  <style type="text/css">
 .loader { position: fixed; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; background: #20a0ff; z-index: 9999;
transition: opacity .65s } .loader-hidden-add { opacity: 1; display: block } .loader-hidden-add-active { opacity: 0 } .loader-hidden
{ display: none } .loader .c-loader { box-sizing: border-box; display: flex; flex: 0 1 auto; flex-direction: column; flex-grow:
1; flex-shrink: 0; position: absolute; top: 50%; left: 50%; height: 100%; width: 100% } @-webkit-keyframes scale { 0% { -webkit-transform:
scale(1); transform: scale(1); opacity: 1; } 45% { -webkit-transform: scale(0.1); transform: scale(0.1); opacity: 0.7; }
80% { -webkit-transform: scale(1); transform: scale(1); opacity: 1; } } @keyframes scale { 0% { -webkit-transform: scale(1);
transform: scale(1); opacity: 1; } 45% { -webkit-transform: scale(0.1); transform: scale(0.1); opacity: 0.7; } 80% { -webkit-transform:
scale(1); transform: scale(1); opacity: 1; } } @-webkit-keyframes rotate_pacman_half_up { 0% { -webkit-transform: rotate(270deg);
transform: rotate(270deg); } 50% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } 100% { -webkit-transform:
rotate(270deg); transform: rotate(270deg); } } @keyframes rotate_pacman_half_up { 0% { -webkit-transform: rotate(270deg);
transform: rotate(270deg); } 50% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } 100% { -webkit-transform:
rotate(270deg); transform: rotate(270deg); } } @-webkit-keyframes rotate_pacman_half_down { 0% { -webkit-transform: rotate(90deg);
transform: rotate(90deg); } 50% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(90deg);
transform: rotate(90deg); } } @keyframes rotate_pacman_half_down { 0% { -webkit-transform: rotate(90deg); transform: rotate(90deg);
} 50% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(90deg); transform: rotate(90deg);
} } @-webkit-keyframes pacman-balls { 75% { opacity: 0.7; } 100% { -webkit-transform: translate(-100px, -6.25px); transform:
translate(-100px, -6.25px); } } @keyframes pacman-balls { 75% { opacity: 0.7; } 100% { -webkit-transform: translate(-100px,
-6.25px); transform: translate(-100px, -6.25px); } } .pacman { position: relative; } .pacman > div:nth-child(2) { -webkit-animation:
pacman-balls 1s -0.99s infinite linear; animation: pacman-balls 1s -0.99s infinite linear; } .pacman > div:nth-child(3) {
-webkit-animation: pacman-balls 1s -0.66s infinite linear; animation: pacman-balls 1s -0.66s infinite linear; } .pacman >
div:nth-child(4) { -webkit-animation: pacman-balls 1s -0.33s infinite linear; animation: pacman-balls 1s -0.33s infinite
linear; } .pacman > div:nth-child(5) { -webkit-animation: pacman-balls 1s 0s infinite linear; animation: pacman-balls 1s
0s infinite linear; } .pacman > div:first-of-type { width: 0px; height: 0px; border-right: 25px solid transparent; border-top:
25px solid #fff; border-left: 25px solid #fff; border-bottom: 25px solid #fff; border-radius: 25px; -webkit-animation: rotate_pacman_half_up
0.5s 0s infinite; animation: rotate_pacman_half_up 0.5s 0s infinite; position: relative; left: -30px; } .pacman > div:nth-child(2)
{ width: 0px; height: 0px; border-right: 25px solid transparent; border-top: 25px solid #fff; border-left: 25px solid #fff;
border-bottom: 25px solid #fff; border-radius: 25px; -webkit-animation: rotate_pacman_half_down 0.5s 0s infinite; animation:
rotate_pacman_half_down 0.5s 0s infinite; margin-top: -50px; position: relative; left: -30px; } .pacman > div:nth-child(3),
.pacman > div:nth-child(4), .pacman > div:nth-child(5), .pacman > div:nth-child(6) { background-color: #fff; width: 15px;
height: 15px; border-radius: 100%; margin: 2px; width: 10px; height: 10px; position: absolute; -webkit-transform: translate(0,
-6.25px); transform: translate(0, -6.25px); top: 25px; left: 70px; }
  </style>
</head>
<body>
  <app-root>
      <div class="loader">
          <div class="c-loader">
            <div class="pacman">
              <div></div>
              <div></div>
              <div></div>
              <div></div>
              <div></div>
            </div>
          </div>
        </div>
  </app-root>
</body>
</html>
